<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<style>
  .addExpName{width:48%; float: left;margin-bottom: 30px;  margin-right: 20px;min-width: 48%;}
  .addExpName .own-span{
    height:40px; font-size:14px; color:#333; line-height:40px; margin:0;
    background:#f9f9f9; padding:0 10px; border: #e1e1e1 1px solid;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
  }
  .own-span{
    width: 90%;
  }
  .addExpName .addExpName  .validatebox-text:focus{
    border: #e1e1e1 1px solid;
    -moz-border-radius: 0 0 5px 5px;/* 左上、右上、右下、左下 */
    -webkit-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
    margin: -1px 0 0 0;
  }
  .addExpName .validatebox-text:focus{
    -moz-border-shadow: 0 0 1px 1px #AEC8F2 inset;border: #96B8EF 1px solid;
    -webkit-border-shadow: 0 0 1px 1px #AEC8F2 inset;
    box-shadow: 0 0 1px 1px #AEC8F2 inset;
  }
  .addExpName  .validatebox-text:focus{
    border-left: none;
  }
  .addExpName .textbox-text{
    padding: 10px;
    line-height:18px; color:#666;
    font-size: 14px;
  }
  .textbox-text{
    border:0;
    margin:0;
    vertical-align: top;
    outline-style: none;
    border-radius: 0 0 5px 5px;
    resize: none;
    min-height: 200px;
  }
  .validatebox-text{
    box-shadow: 0 0 2px #ccc;
    width: 90%;
    min-width: 90%;
  }
</style>
<script>
  /*消耗品信息自动补全*/
  autoCompleteExp("expCode");
  autoCompleteExp("expName");
  autoCompleteExp("packageSpec");
  function autoCompleteExp(inputId){
    var url="${ctx}/csm/expInfo/autoComplete";
    autoComplete(inputId,url,
            function(data){
              var rows = [];
              for(var i=0; i<data.length; i++){
                rows[rows.length] = {
                  data:data[i],
                  value:data[i].id,
                  result:data[i].expName
                };
              }
              return rows;
            },function(data, i, max){
              return data.expDict.expCode+"|"+data.expDict.expName+"|"+data.packageSpec;
            },function(event,data,formatted){
              $('#expCode').val(data.expDict.expCode);
              $('#expName').val(data.expDict.expName);
              $('#packageSpec').val(data.packageSpec);
              $('#expInfoId').val(data.id);
            });
  }
</script>
<div class="content-wrap">
  <div class="wrapper" style="bottom: 50px;">
    <ul class="nav nav-tabs">
      <li>
        <a href="#"  onclick="loadDiv('mainCenterDiv','${ctx}/csm/expDetails/index')">消耗理信息列表</a>
      </li>
      <li class="active">
        <a href="#" onclick="loadDiv('mainCenterDiv','${ctx}/csm/expDetails/form')">
          <c:choose>
            <c:when test="${expDetails.id==''|| expDetails.id==null}">
              消耗理信息添加
            </c:when>
            <c:otherwise>消耗理信息修改</c:otherwise>
          </c:choose>
        </a>
      </li>
    </ul>
    <section class="panel panel-default">
      <div class="panel-body" style="padding: 0">
        <div class="col-lg-12" style="padding: 0">
          <form:form id="inputForm" data-parsley-validate="" modelAttribute="expDetails" onsubmit="return formSaveLoad('mainCenterDiv','inputForm','${ctx}/csm/expDetails/save','${ctx}/csm/expDetails/index');" method="post" class="form-horizontal">
            <form:hidden path="id"/>
            <form:hidden path="expInfoId"/>
            <div class="container-fluid" style="background-color: #fafafc;margin: 0;padding-top:15px ">
              <div class="form-group col-sm-4">
                <label class="col-sm-3 control-label">消耗品代码：</label>
                <div class="col-sm-6">
                  <form:input path="expCode" id="expCode" htmlEscape="false" class="form-control"  maxlength="40" />
                </div>
              </div>
              <div class="form-group col-sm-4">
                <label class="col-sm-3 control-label">消耗品名称：</label>
                <div class="col-sm-6">
                  <form:input path="expName" id="expName" htmlEscape="false" class="form-control"  maxlength="40" />
                </div>
              </div>
              <div class="form-group col-sm-4">
                <label class="col-sm-3 control-label">消耗品规格：</label>
                <div class="col-sm-6">
                  <form:input path="packageSpec" id="packageSpec" htmlEscape="false" class="form-control"  maxlength="40" />
                </div>
              </div>
            </div>
            <div class="container" style="margin-top: 15px">
              <div class="addExpName">
                <div class="own-span">消耗理作用：</div>
                <form:textarea path="action" htmlEscape="false" cssClass="textbox-text validatebox-text" maxlength="2000" />
              </div>
              <div class="addExpName">
                <div class="own-span">适用症：</div>
                <form:textarea path="indication" htmlEscape="false" cssClass="textbox-text validatebox-text" maxlength="2000" />
              </div>
              <div class="addExpName">
                <div class="own-span">用法用量：</div>
                <form:textarea path="dosage" htmlEscape="false" cssClass="textbox-text validatebox-text" maxlength="2000" />
              </div>
              <div class="addExpName">
                <div class="own-span">制剂：</div>
                <form:textarea path="form" htmlEscape="false" cssClass="textbox-text validatebox-text" maxlength="2000" />
              </div>
              <div class="addExpName">
                <div class="own-span">消耗代动力学：</div>
                <form:textarea path="pharmacokinetics" htmlEscape="false" cssClass="textbox-text validatebox-text" maxlength="2000" />
              </div>
              <div class="addExpName">
                <div class="own-span">不良反应：</div>
                <form:textarea path="adverseReaction" htmlEscape="false" cssClass="textbox-text validatebox-text" maxlength="2000" />
              </div>
              <div class="addExpName">
                <div class="own-span">注意事项：</div>
                <form:textarea path="attention" htmlEscape="false" cssClass="textbox-text validatebox-text" maxlength="2000" />
              </div>
              <div class="addExpName">
                <div class="own-span">禁忌：</div>
                <form:textarea path="contraindication" htmlEscape="false" cssClass="textbox-text validatebox-text" maxlength="2000" />
              </div>
            </div>
            <div class="form-group">
              <div class="col-sm-offset-5 col-sm-12">
                <input id="btnSubmit" class="btn btn-primary" type="submit" value="保 存">&nbsp;
                <input id="btnCancel" class="btn" type="button" value="返 回" onclick="loadDiv('mainCenterDiv','${ctx}/csm/expDetails/index')">
              </div>
            </div>
          </form:form>
        </div>

      </div>
    </section>
  </div>
</div>